<script setup lang="ts">
import { download, get, loadFile, message, post } from '@/utils'
import Modal from './components/EditModal.vue'
import useModal from '@/hooks/useModal'
import useTable from '@/hooks/useTable'
import { BtnPermission } from '@/enum/permission'
import AuditModal from '@/components/Modal/Audit.vue'
import useValueEnum from '@/hooks/useValueEnum'
const { store } = useModal()
const { store: auditStore } = useModal()
const { formatColumns } = useTable()
const searchQuery = reactive({})
const formRef = ref()
const actionRef = ref()
const selectedKeys = ref([])
const pagination = {
  showPageSize: true,
  pageSize: 20,
}

const { valueEnum: sellerClassify } = useValueEnum('/server-shop/admin/seller/category/list')
const request = (params: any, sort: any, filters: any): Promise<any> => {
  return new Promise((resolve, reject) => {
    const query = { ...params, size: params.pageSize }
    Reflect.deleteProperty(query, 'pageSize')
    get(
      {
        url: '/server-shop/admin/seller/update/audit/page',
        data: query,
      },
      ({ data, code }) => {
        const list: any[] = []
        data.records.forEach(element => {
          list.push({
            ...element,
            ...element.updateInfoVO,
            ...element.updateInfoVO.exVo,
          })
        })
        resolve({
          data: list,
          total: data.total,
          success: code == 200,
        })
      }
    )
  })
}
const handleBatch = () => {
  if (selectedKeys.value.length) {
    auditStore.handleShow({ id: selectedKeys.value.join(',') })
  } else
    message({
      content: '至少选择一条数据',
      type: 'error',
    })
}
/**共用的配置项 */
const columns = formatColumns([
  {
    title: 'ID',
    dataIndex: 'id',
    width: 200,
    hideInSearch: false,
  },
  {
    title: '门店名称',
    dataIndex: 'name',
    width: 200,
    hideInSearch: false,
  },
  {
    title: '商户姓名',
    dataIndex: 'legalPerson',
    width: 200,
    hideInSearch: false,
  },
  {
    title: '联系电话',
    dataIndex: 'mobile',
    width: 200,
  },
  {
    title: '商户分类',
    dataIndex: 'categoryId',
    width: 200,
    valueType: 'select',
    hideInSearch: false,
    valueEnum: sellerClassify,
  },
  {
    title: '门店位置',
    dataIndex: 'address',
    width: 200,
    ellipsis: true,
  },
  { title: '审核备注', dataIndex: 'remark', width: 200, ellipsis: true },

  {
    title: '操作',
    dataIndex: 'options',
    width: 230,
    fixed: 'right',
    btnList: [
      {
        name: '审核',
        permission: BtnPermission.审核,
        handle: ({ record }) => {
          auditStore.handleShow(record)
        },
      },
      // {
      //   name: '编辑',
      //   handle: ({ record }) => {
      //     console.log('编辑')
      //     store.handleShow(record, true)
      //   },
      // },
      {
        name: '查看',
        permission: BtnPermission.查看,
        handle: ({ record }) => {
          store.handleShow(record, false)
          console.log('查看')
        },
      },
    ],
  },
])
</script>

<template>
  <div class="page">
    <ProTable
      v-model:selectedKeys="selectedKeys"
      :row-selection="{
        type: 'checkbox',
        showCheckedAll: true,
        onlyCurrent: false,
      }"
      :columns="columns"
      :request="request"
      row-key="id"
      :form-ref="ref => (formRef = ref)"
      :pagination="pagination"
      header-title=" "
      column-resizable
      :scroll="{ x: 1000 }"
      :params="searchQuery"
      :bordered="{ cell: true }"
      :action-ref="ref => (actionRef = ref)"
    >
      <template #option-render="{ dom, reset }">
        <component :is="dom[1]" />
        <component :is="dom[0]" />
      </template>
      <template #tool-bar>
        <a-button type="primary" @click="handleBatch" class="mb10" v-permission="[BtnPermission.审核]">
          <template #icon>
            <icon-pen-fill />
          </template>
          批量审核
        </a-button>
      </template>
    </ProTable>
    <AuditModal api="/server-shop/admin/seller/update/audit" v-if="auditStore.show" v-model:show="auditStore.show" :id="auditStore.id" @confirm="actionRef.reload" />
    <Modal v-if="store.show" v-model:show="store.show" :info="store.info" @confirm="actionRef.reload" :edit="store.edit" />
  </div>
</template>
